<!--
 * @Author: 大白
 * @Date: 2020-01-17 09:58:41
 * @LastEditors: 杨振洲 yzz0412521@163.com
 * @LastEditTime: 2022-08-25 09:22:27
 * @Description: 文件描述
 * @FilePath: \cyf_admin\src\views\activity_manage\product_list\gears\package\select.vue
 -->
 <template>
  <el-dialog title="选取优惠券" :visible.sync="state" width="75%">
    <el-divider
      >已选优惠券数量:{{ couponListAil.length }} 已选优惠券金额:{{
        money | float2
      }}</el-divider
    >
    <div class="tabBox">
      <el-table :data="couponList" border="" height="600">
        <el-table-column
          property="couponName"
          label="待选优惠券"
        ></el-table-column>
        <el-table-column property="minimumAmount" label="最低消费">
          <template slot-scope="scope">{{
            rewriteDivide(scope.row.minimumAmount, 100)
          }}</template>
        </el-table-column>
        <el-table-column property="preAmount" label="优惠券金额">
          <template slot-scope="scope">{{
            rewriteDivide(scope.row.preAmount, 100)
          }}</template>
        </el-table-column>
        <el-table-column property="names" label="优惠券类型">
          <template slot-scope="scope">{{
            typeName(scope.row.productId)
          }}</template>
        </el-table-column>
        <el-table-column property="superposition" label="是否可叠加">
          <template slot-scope="scope">{{
            scope.row.superposition == 1 ? "是" : "否"
          }}</template>
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-link type="success" @click="select(scope)">选择</el-link>
          </template>
        </el-table-column>
      </el-table>
      <el-table :data="couponListAil" border="" height="600">
        <el-table-column
          property="couponName"
          label="已选优惠券"
        ></el-table-column>
        <el-table-column property="minimumAmount" label="最低消费">
          <template slot-scope="scope">{{
            rewriteDivide(scope.row.minimumAmount, 100)
          }}</template>
        </el-table-column>
        <el-table-column property="preAmount" label="优惠券金额">
          <template slot-scope="scope">{{
            rewriteDivide(scope.row.preAmount, 100)
          }}</template>
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-link type="success" @click="del(scope)">移除</el-link>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="state = false">取 消</el-button>
      <el-button type="primary" @click="confirm">确 定</el-button>
    </div>
  </el-dialog>
</template>
<style lang="scss" scoped>
.tgb {
  display: flex;
  justify-content: space-between;
}
.tabBox {
  display: flex;
  justify-content: space-between;
}
.el-table {
  max-width: 48%;
  max-height: 600px;
  height: 600px;
}
::v-deep .el-dialog {
  width: 70%;
}
</style>

<script>
import {
  getCouponList
} from "@/config/interface";
import { divide, minus } from "@/utils/tools";

export default {

  data () {
    return {
      state: false,
      couponList: [],
      couponListAil: [],
      money: 0,
      parentData: []
    };
  },

  methods: {

    rewriteDivide (n, m) {
      return divide(n, m);
    },

    confirm () {
      let arr = [];
      console.log(this.couponListAil)
      this.couponListAil.map(item => {
        arr.push({
          id: item.id,
          preAmount: item.preAmount,
          couponKind: item.couponKind
        });
      });
      this.$emit('selectCoupon', arr)
      this.state = false

    },
    del (row) {
      this.couponListAil.splice(row.$index, 1);
      this.money = minus(this.money, divide(row.row.preAmount, 100));
    },
    select (row) {
      this.couponListAil.push(this.couponList[row.$index]);
      this.money = 0;
      this.couponListAil.map(item => {
        this.money += this.rewriteDivide(item.preAmount, 100);
      });
    },
    getCouponlist () {
      getCouponList({ "storeId": 2000042, "couponKind": "2" }).then(res => {
        this.couponList = res.data.result.list;
        this.parentData.map(item => {
          this.couponList.map(coupon => {
            if (item.id == coupon.id) {
              this.couponListAil.push(coupon)
            }
          })
        })
        this.money = 0;
        this.couponListAil.map(item => {
          this.money += this.rewriteDivide(item.preAmount, 100);
        });
      });
    },

    typeName (n) {
      let str = "";
      switch (n) {
        case 1:
          str = "柴油";
          break;
        case 2:
          str = "汽油";
          break;
        case 3:
          str = "非油";
          break;
        case 25:
          str = "LNG";
          break;
        case 26:
          str = "CNG";
          break;
      }
      return str;
    },

    show (data) {
      console.log(data)
      this.parentData = data.couponDTOList
      this.getCouponlist();
      this.couponListAil = [];
      this.money = 0;
      this.state = true
    }
  },
  mounted () { }
};
</script>
